<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.totoro.domain.PublicReply" %>
<%@ include file="/WEB-INF/jsp/include.jsp"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" 
        + request.getServerPort() + path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="<%=basePath%>css/ls3.css" rel="stylesheet" type="text/css" />
    <link href="<%=basePath%>images/skin.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="<%=basePath%>js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    
        $(function() {
            
            // 设置各按钮状态（是否可用）
            setButtonState();
            $("#numbers").html($.trim($("#remark").val()).length);
            
            // 根据选择设置评语
            $("#remarkTemplate").change(function() {
                $.ajax({
                    url: '../mySysRemarkTemplate/findById.html',
                    data: {id: $(this).val()},
                    dataType: 'json'
                }).done(function(data) {
                    $("#remark").val(data.description);
                    setButtonState();
                    $("#numbers").html($.trim($("#remark").val()).length);
                }).fail(function() {
                    $("#remark").val("");
                    setButtonState();
                    $("#numbers").html($.trim($("#remark").val()).length);
                });
            });
            
            // IE10中可以不用这个，其他版本求测试，先保留
            document.getElementById("remark").onpropertychange = function() {
                setButtonState();
                $("#numbers").html($.trim($("#remark").val()).length);
            };
            
            if (window.addEventListerner) {
                document.getElementById("remark").addEventListener('input', function() {
                    setButtonState();
                    $("#numbers").html($.trim($("#remark").val()).length);
                });
            }
            
            // 提交
            $("#submitBtn").click(function() {
                if (isValidate()) {
                    $("#publicReplyForm").attr("action", "../publicReply/savePublicReply.html");
                    $("#publicReplyForm").submit();
                }
            });
            
            // 暂存
            $("#tmpStoreBtn").click(function() {
                $("#publicReplyForm").attr("action", "../publicReply/tmpStorePublicReply.html");
                $("#publicReplyForm").submit();
            });
            
            // 保存评语模板
            $("#saveAsTemplate").click(function() {
                var templateContent = $.trim($("#remark").val());
                
                if (templateContent.length <= 0) {
                    alert("请先填写评语...");
                    return false;
                }
                
                var defaultValue;
                var selectedTemplate = $("#remarkTemplate").children(":selected");
                if (selectedTemplate.val() == '0') {
                    defaultValue = "答辩小组意见-优秀";
                } else {
                    defaultValue = $.trim(selectedTemplate.text());
                }
                
                inputPrompt(defaultValue);
                
            });
            
            // 计算总成绩
            calculateTotalMark();
            
            $("select.mark").change(function() {
                // 动态显示总成绩
                calculateTotalMark();
                setButtonState();
            });
            
            // 取消按钮点击时重新计算总成绩
            $("#cancelBtn").click(function() {
                calculateTotalMark();
            });
            
        });
        
        // Excel 表格导出
        function exportToExcel(projectId) {
            var url = "../publicReply/toPublicReplyExcel.html?projectId=" + projectId;
            window.open(url);
        }
        
        // 计算总成绩
        function calculateTotalMark() {
            
            var totalMark = 0;
            if($("select.mark").length > 0) {
                var currentValue;
                $("select.mark").each(function() {
                    currentValue = parseInt($(this).children(":selected").val());
                    if (currentValue < 0) {
                        currentValue = 0;
                    }
                    totalMark += currentValue;
                });
            } else {
                $("input.mark").each(function() {
                    totalMark += parseInt($(this).val());
                });
            }
            
            $("#totalMark").val(totalMark);
        }
        
        function setButtonState() {
            if ($('#publicReplyState').val() == 'true') {
                $("#remarkTemplate").attr("disabled", "disabled");
                $("#submitBtn").attr("disabled", "disabled");
                $("#tmpStoreBtn").attr("disabled", "disabled");
                $("#cancelBtn").attr("disabled", "disabled");
                $("#saveAsTemplate").attr("disabled", "disabled");
                $("#remark").attr("disabled", "disabled");
            } else {
                if (isValidate()) {
                    $("#submitBtn").removeAttr("disabled");
                    $("#tmpStoreBtn").removeAttr("disabled");
                } else {
                    $("#submitBtn").attr("disabled", "disabled");
                    $("#tmpStoreBtn").attr("disabled", "disabled");
                }
            }
        }
        
        function isValidate() {
            
            var currentValue;
            var isValidate = true;
            
            $("select.mark").each(function() {
                currentValue = parseInt($(this).children(":selected").val());
                if (currentValue < 0) {
                    isValidate = false;
                    return;
                }
            });
            
            if (!isValidate) {
                return false;
            }
            
            if($.trim($("#remark").val()).length < 20) {
                return false;
            }
            
            return true;
        }
        
        var keyword;
        var isOK = false;
        var isDuplicated = false;
        
        function inputPrompt(defaultValue) {
            keyword = window.prompt("输入模板标题", defaultValue);
            if (keyword != null && $.trim(keyword).length > 0) {
                $.ajax({
                    url: '../publicReply/getRemarkTemplateKeywords.html',
                    data: {'keyword': keyword},
                    dataType: 'json',
                    type: 'POST'
                }).done(function(data) {
                    isDuplicated = data.isDuplicated;
                        
                    if (isDuplicated) {
                        isOK = confirm("您输入的关键字已经存在，是否替换模板？\r\n点击确定直接替换，点击取消后修改关键字。");
                        if(!isOK) {
                            inputPrompt(defaultValue);
                        } else {
                            saveAsTemplate();
                        }
                    } else {
                        saveAsTemplate();
                    }
                });
            } else {
                return;
            }
                
        }
        
        function saveAsTemplate() {
            
            var selectedTemplate = $("#remarkTemplate").children(":selected");
            var templateContent = $.trim($("#remark").val());
            
            // isOK == true : 替换
            if (isOK) {
                $.ajax({
                    url: '../publicReply/saveAsTemplate.html',
                    data: {id: $.trim(selectedTemplate.val()), keyword: $.trim(keyword), description: templateContent},
                    dataType: 'json',
                    type: 'POST',
                    success: function(data) {
                        alert("保存成功!");
                    }
                });
            } else {    // isOK == false : 添加
                $.ajax({
                    url: '../publicReply/saveAsTemplate.html',
                    data: {keyword: $.trim(keyword), description: templateContent},
                    dataType: 'json',
                    type: 'POST',
                    success: function(data) {
                        alert("保存成功!");
                    }
                });
            }
            
        }
        
    </script>
</head>
<body>
    <div id="contain2">
        <table width="100%" border="0" cellpadding="0" cellspacing="0"
            class="tab1">
            <tr>
                <td width="17" valign="top"
                    background="<%=basePath%>images/mail_leftbg.gif"><img
                    src="<%=basePath%>images/left-top-right.gif" width="17" height="29" /></td>
                <td valign="top" background="<%=basePath%>images/content-bg.gif">
                    <table width="100%" height="31" border="0" cellpadding="0"
                        cellspacing="0" class="left_topbg" id="table2">
                        <tr>
                            <td height="31"><div class="titlebt">
                                    <p>指导老师评审表</p>
                                </div></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>

        <div id="main">
            <div class="main1">
                <p>山&nbsp;东&nbsp;建&nbsp;筑&nbsp;大&nbsp;学&nbsp;毕&nbsp;业&nbsp;论&nbsp;文&nbsp;答&nbsp;辩&nbsp;小&nbsp;组&nbsp;意&nbsp;见&nbsp;表</p>
            </div>
            <div class="main2">
                <p>基本信息</p>
            </div>
            <div class="main3">
                <div class="bt22">
                    <p>题目名称</p>
                </div>
                <div class="bt33">
                    <p>学生姓名</p>
                </div>
                <div class="bt44">
                    <p>班级</p>
                </div>
                <div class="bt55">
                    <p>学号</p>
                </div>
            </div>
            <div class="main3">
                <div class="bt22">
                    <p>${project.title}</p>
                </div>
                <div class="bt33">
                    <p>${project.student.name}</p>
                </div>
                <div class="bt44">
                    <p>${project.student.studentClass.description}</p>
                </div>
                <div class="bt55">
                    <p>${project.student.no}</p>
                </div>
            </div>

            <!--<c:url var="action" value="/tutor/tutorReview.html" />-->
            <form:form id="publicReplyForm" modelAttribute="publicReply" method="post">
                <div class="main2">
                    <p>指导教师评分（每项各占10分，总计40分）</p>
                </div>
                <div class="main6">
                    <div class="bt8">
                        <p>
                            <br />完成任务书规定的要求与水平评分
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />论文与实物的质量评分
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />论文内容的答辩陈述评分
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />回答问题的正确性评分
                        </p>
                    </div>
                    <div class="bt9">
                        <p>
                            <br />答辩总评分
                        </p>
                    </div>
                </div>
                <div class="main6">
                    <input type="hidden" name="projectId" value="${project.id}"/>
                    <input type="hidden" id="publicReplyState" value="${publicReply.state}"/>
                    <div class="bt8">
                        <p>
                            <br />
                            <c:choose>
                                <c:when test="${publicReply.state == true}">
                                    <form:input class="mark" path="completeness" readonly="true" size="4"/>
                                </c:when>
                                <c:otherwise>
                                    <form:select class="mark" path="completeness">
                                        <form:option value="-1" label="-打分-" />
                                        <form:options items="${marks}"/>
                                    </form:select>
                                </c:otherwise>
                            </c:choose>
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />
                            <c:choose>
                                <c:when test="${publicReply.state == true}">
                                    <form:input class="mark" path="achievementLevel" readonly="true" size="4"/>
                                </c:when>
                                <c:otherwise>
                                    <form:select class="mark" path="achievementLevel">
                                        <form:option value="-1" label="-打分-" />
                                        <form:options items="${marks}"/>
                                    </form:select>
                                </c:otherwise>
                            </c:choose>
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />
                            <c:choose>
                                <c:when test="${publicReply.state == true}">
                                    <form:input class="mark" path="statement" readonly="true" size="4"/>
                                </c:when>
                                <c:otherwise>
                                    <form:select class="mark" path="statement">
                                        <form:option value="-1" label="-打分-"/>
                                        <form:options items="${marks}"/>
                                    </form:select>
                                </c:otherwise>
                            </c:choose>
                        </p>
                    </div>
                    <div class="bt8">
                        <p>
                            <br />
                            <c:choose>
                                <c:when test="${publicReply.state == true}">
                                    <form:input class="mark" path="reply" readonly="true" size="4"/>
                                </c:when>
                                <c:otherwise>
                                    <form:select class="mark" path="reply">
                                        <form:option value="-1" label="-打分-"/>
                                        <form:options items="${marks}"/>
                                    </form:select>
                                </c:otherwise>
                            </c:choose>
                        </p>
                    </div>
                    <div class="bt9">
                        <p>
                            <br/>
                            <input id="totalMark" type="text" readonly="readonly" size="4" maxlength="4"/>
                        </p>
                    </div>
                </div>
                <div class="main7">
                    <p>&nbsp;&nbsp;答辩小组意见：</p>
                </div>

                <div class="main8">
                    <form:textarea id="remark" path="remark" cols="90" rows="6" />
                    <div id="remarkLength" style="margin: 6px; clear:both; font-size: 14px;">
                        <label style="color: green">字数至少20, 您已输入 </label><label id="numbers" style="color:red">0</label><label style="color:green"> 字</label>
                    </div>
                </div>

                <div class="main8">
                   <label for="remarkTemplate">评语模板：</label>
                   <select id="remarkTemplate">
                        <option value="0">-请选择-</option>
                        <c:forEach items="${remarkTemplateList}" var="template" varStatus="i">
                            <option value="${template.id}">${template.keyword}</option>
                        </c:forEach>
                    </select>
                    <input type="button" value="保存为模板" id="saveAsTemplate"/>
                </div>
                
                <p style="margin-left: 15px;">注：各专业应根据自己的具体情况，制定出适合本专业的毕业设计（论文）的具体要求和评分标准。</p>
                
                <p align="right">
                    <input id="toExcelBtn" type="button" value="导出excel表" onclick="exportToExcel(${project.id})"/>
                    <!-- 
                    <input id="printBtn" type="button" value="打印" />
                     -->
                    <input id="submitBtn" type="button" value="提交"/>
                    <input id="tmpStoreBtn" type="button" value="暂存" />
                    <input id="cancelBtn" type="reset" value="取消" />
                </p>
                
            </form:form>
        </div>
    </div>
</body>
</html>